<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./06-style.css">
  <!-- 引入iconfont.css, 用于生成小图标 -->
  <link rel="stylesheet" href="./font/iconfont.css">

  <!-- 
    1. 拔掉网线，电脑连接手机热点(让电脑和手机处于同一局域网)
    2. 下载live server插件，打开（http://127.0.0.1:5500/0916/06-%E7%8C%AB%E7%9C%BC%E9%A6%96%E9%A1%B5.html）
    3. 打开终端，输入ipconfig，查看ipv4的地址(http://10.60.105.240:5500/0916/06-%E7%8C%AB%E7%9C%BC%E9%A6%96%E9%A1%B5.html)
    4. 在手机浏览器直接输入最后的地址就可以查看了(微信里面直接打开)
  
  -->
</head>
<body>
  <div id="app">
    <header>
      <h2>猫眼电影</h2>
      <span class="iconfont icon-ego-menu"></span>
    </header>

    <nav>
      <span class="city">杭州</span>
      <ul>
        <li>热映</li>
        <li>影院</li>
        <li>待映</li>
      </ul>
      <span class="iconfont icon-ai219"></span>
    </nav>


    <main>
      <div class="top-rated">
        <p class="title">最受好评电影</p>
        <div class="rated-list">
          <div class="rated-item">1</div>
          <div class="rated-item">2</div>
          <div class="rated-item">3</div>
          <div class="rated-item">4</div>
          <div class="rated-item">5</div>
          <div class="rated-item">6</div>
          <div class="rated-item">7</div>
        </div>
      </div>

      <div class="bottom-movies"></div>
    </main>


    <footer></footer>
  </div>

  <script src="./06-flexible.js"></script>
</body>
</html>